<template>
  <div>
    <van-button  @click="handleClick">
      立即支付
    </van-button>
    <van-button  @click="test">
      弹窗测试
    </van-button>
  </div>
</template>

<script setup>
import { PayService } from '@/api/api';
import {ref} from "vue";
import {showToast} from "vant"; // 导入PayService

const order = ref({
  out_trade_no: 'TREHH644643643',
  subject: '支付测试',
  total_amount: 100.00,
});

const handleClick = async () => {
  try {
    const response = await PayService.pay(order.value); // 调用PayService的pay方法，并传入payInfo参数
    console.log(response);
    const divForm = document.getElementsByTagName('div');
    if (divForm.length) {
      document.body.removeChild(divForm[0]);
    }
    const div = document.createElement('div');
    div.innerHTML = response.data.msg; // data就是接口返回的form表单字符串
    document.body.appendChild(div);
    document.forms[0].setAttribute('target', '_self'); // 新开窗口跳转
    document.forms[0].submit();
  } catch (error) {
    console.error(error); // 处理错误
  }
};

const test = () => {
  showToast('提示内容');
};
</script>


<style scoped>

</style>